<template>
  <basic-container>
    <avue-crud
      :option="option"
      :table-loading="loading"
      :data="data"
      ref="crud"
      :page.sync="page"
      :search.sync="search"
      v-model="form"
      @row-del="rowDel"
      @row-update="rowUpdate"
      @row-save="rowSave"
      @search-change="searchChange"
      @search-reset="searchReset"
      @selection-change="selectionChange"
      @current-change="currentChange"
      @size-change="sizeChange"
      @refresh-change="refreshChange"
      @on-load="onLoad"
      @tree-load="treeLoad"
    >
      <template slot="menuLeft">
        <el-button type="primary" size="small" icon="el-icon-plus" v-if="permission.productpackingconfig_add_refactor" @click="handleAdd">新 增</el-button>
        <el-button type="warning" size="small" icon="el-icon-s-promotion" v-if="permission.productpackingconfig_add_refactor" @click="rmaRepairIn">进维修</el-button>
        <el-button type="danger" size="small" icon="el-icon-delete" v-if="permission.productpackingconfig_delete_refactor" @click="handleDelete">删 除 </el-button>
        <el-button type="primary" size="small" icon="el-icon-s-promotion" v-if="permission.productpackingconfig_add_refactor" @click="handleDelivery">发 货</el-button>
      </template>
      <template slot-scope="scope" slot="menu">
        <el-button icon="el-icon-view" size="small" type="text" v-if="permission.productpackingconfig_view_refactor" @click="opendetailRow(scope.row, 'view')">详情</el-button>
        <el-button icon="el-icon-edit" size="small" type="text" v-if="permission.productpackingconfig_edit_refactor" @click.stop="opendetailRow(scope.row, 'edit')"
          >编辑</el-button
        >
        <el-button icon="el-icon-delete" size="small" type="text" v-if="permission.productpackingconfig_delete_refactor" @click.stop="detailRowDel(scope.row, scope.index, done)"
          >删除
        </el-button>
      </template>
    </avue-crud>
    <el-dialog class="showDialog" ref="dialog" :title="dialogTitle" append-to-body :visible.sync="showDialog" top="5vh" @close="closeDialog" width="80%">
      <div class="titleIcon">
        <i class="el-icon-vertical-bar avue-group__icon"></i>
        <h4>基础信息</h4>
      </div>
      <avue-form v-if="showDialog" ref="form" v-model="form" :option="basicDataOption"></avue-form>
      <div class="titleIcon">
        <i class="el-icon-vertical-bar avue-group__icon"></i>
        <h4>产品信息</h4>
      </div>
      <avue-crud v-if="showDialog" :option="productInfoOption" :data="productInfoData" @row-del="rowDel" @selection-change="selectionProductChange">
        <template slot="menuLeft" v-if="dialogTitle != '查看'">
          <el-button type="primary" size="small" icon="el-icon-plus" @click="handleAddProduct">添 加</el-button>
          <el-button type="danger" size="small" icon="el-icon-delete" @click="handleDeleteProduct">删 除 </el-button>
        </template>
      </avue-crud>
      <div class="titleIcon">
        <i class="el-icon-vertical-bar avue-group__icon"></i>
        <h4>物流信息</h4>
      </div>
      <avue-form v-if="showDialog" ref="logisticsInfoForm" v-model="form" :option="logisticsInfoOption"></avue-form>
      <span slot="footer" class="dialog-footer">
        <el-button v-if="dialogTitle === '新增'" size="small" type="primary" @click="submit"> <i class="el-icon-circle-plus-outline"></i><span>保 存</span></el-button>
        <el-button v-if="dialogTitle === '编辑'" size="small" type="primary" @click="submit"> <i class="el-icon-circle-check"></i><span>修 改</span></el-button>
        <el-button size="small" @click="showDialog = false"><i class="el-icon-circle-close"></i><span>取 消</span></el-button>
      </span>
    </el-dialog>
    <!-- rma发货模态框 -->
    <rma-delivery-modal ref="rmaDeliveryRef" :config="rmaDeliveryConfig" @close="close" @submit="deliverySubmit"></rma-delivery-modal>
    <common-modal-template ref="commonModalTemplate" :option="tableOption" @getSelectedRows="getSelectedRows" :key="timer" @newKey="newKey"></common-modal-template>
  </basic-container>
</template>

<script>
import { getList, remove, addOrUpdate, repairIn, getDetail, getFailure } from '@/api/repair/rmaRegistration';
import { mapGetters } from 'vuex';
import CommonModalTemplate from '@/components/common-modal-template/common-modal-template.vue';
import RmaDeliveryModal from './components/rmaDeliveryModal.vue';
export default {
  name: 'ProductProductpackingconfig',
  components: {
    CommonModalTemplate,
    RmaDeliveryModal
  },
  data() {
    var validatorCompensationAmt = (rule, value, callback) => {
      if (!value && value != 0) {
        callback(new Error('请输入赔偿金'));
      } else {
        if (value <= 0) {
          callback(new Error('赔偿金不能小于等于0'));
        } else {
          callback();
        }
      }
    };
    return {
      form: {},
      query: {},
      loading: true,
      selectionList: [],
      rmaDeliveryConfig: {
        visible: false
      },
      page: {
        pageSize: 20,
        currentPage: 1,
        total: 0
      },
      option: {
        height: 'calc(100vh - 438px)',
        calcHeight: 30,
        tip: false,
        simplePage: true,
        searchShow: true,
        searchMenuSpan: 6,
        dialogWidth: '60%',
        border: true,
        index: true,
        indexLabel: '序号',
        selection: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        viewBtn: false,
        menuWidth: 300,
        dialogClickModal: false,
        columnBtn: false,
        column: [
          {
            label: 'RMA号',
            prop: 'rmaNo',
            search: true
          },
          {
            label: '销售出库单号',
            prop: 'deliveryOrderNo'
          },
          {
            label: '客户名称',
            prop: 'partnerName',
            search: true
          },
          {
            label: '产品名称',
            prop: 'partName',
            search: true
          },
          {
            label: '产品编码',
            prop: 'partNo'
          },
          {
            label: '订单数量',
            prop: 'orderQuantity'
          },
          {
            label: '返厂数量',
            prop: 'rmaQuantity'
          },
          {
            label: '客户诉求',
            prop: 'clientConcern'
          },
          {
            label: '退货登记时间',
            prop: 'entryTime'
          },
          {
            label: '维修状态',
            prop: 'rmaProductStatus',
            html: true,
            formatter: (val) => {
              switch (val.rmaProductStatus) {
                case 1:
                  return `<span class="stateWords-warning">待维修</span>`;
                case 2:
                  return `<span class="stateWords-success">维修中</span>`;
                case 3:
                  return `<span class="stateWords-primary">已维修</span>`;
                default:
                  break;
              }
            }
          },
          {
            label: '发货状态',
            prop: 'deliveryRecordStatus',
            html: true,
            formatter: (val) => {
              switch (val.deliveryRecordStatus) {
                case 1:
                  return `<span class="stateWords-warning">待发货</span>`;
                case 2:
                  return `<span class="stateWords-primary">已发货</span>`;
                default:
                  return `<span></span>`;
              }
            }
          }
        ]
      },
      data: [],
      dialogTitle: '新增',
      basicDataOption: {
        submitBtn: false,
        emptyBtn: false,
        labelWidth: 150,
        column: [
          {
            label: '销售出库单',
            prop: 'deliveryOrderNo',
            type: 'search',
            disabled: true,
            span: 8,
            placeholder: '请选择 销售出库单',
            rules: [
              {
                required: true,
                message: '请选择销售出库单',
                trigger: 'blur'
              }
            ],
            appendClick: () => {
              if (this.dialogTitle === '新增') {
                this.openDeliveryOrderCommonModal();
              }
            }
          },
          {
            label: '客户名称',
            prop: 'partnerName',
            disabled: true,
            span: 8,
            placeholder: '客户名称'
          },
          {
            label: '客户诉求',
            prop: 'clientConcern',
            span: 8,
            type: 'select',
            dicData: [
              { label: '返修', value: '返修' },
              { label: '换新', value: '换新' }
            ]
          },
          {
            label: '是否保内',
            prop: 'isUnderWarranty',
            span: 8,
            type: 'select',
            dicData: [
              { label: '是', value: true },
              { label: '否', value: false }
            ]
          },
          {
            label: '退货原因',
            prop: 'reason',
            span: 8
          },
          {
            label: '是否赔偿',
            prop: 'isCompensation',
            span: 8,
            type: 'radio',
            dicData: [
              { label: '是', value: true },
              { label: '否', value: false }
            ],
            value: false,
            control: (val, form) => {
              if (val) {
                return {
                  compensationAmt: { display: true }
                };
              } else {
                return {
                  compensationAmt: { display: false }
                };
              }
            }
          },
          {
            label: '赔偿金',
            prop: 'compensationAmt',
            span: 8,
            type: 'number',
            precision: 2,
            rules: [
              {
                required: true,
                validator: validatorCompensationAmt,
                trigger: 'blur'
              }
            ]
          },
          {
            label: '业务员',
            prop: 'salesman',
            span: 8
          }
        ]
      },
      showDialog: false,
      tableOption: {},
      timer: new Date().getTime(),
      search: {},
      productInfoData: [],
      productInfoOption: {
        height: '300',
        calcHeight: 30,
        tip: false,
        border: true,
        index: true,
        indexLabel: '序号',
        selection: true,
        addBtn: false,
        editBtn: false,
        delBtn: false,
        viewBtn: false,
        menu: false,
        cellBtn: true,
        refreshBtn: false,
        columnBtn: false,
        column: [
          {
            label: '销售出库单号',
            prop: 'deliveryOrderNo'
          },
          {
            label: '产品编码',
            prop: 'partNo'
          },
          {
            label: '产品名称',
            prop: 'partName'
          },
          {
            label: '规格型号',
            prop: 'partModel'
          },
          {
            label: '订单数量',
            prop: 'orderQuantity'
          },
          {
            label: '返厂数量',
            prop: 'rmaQuantity',
            cell: true,
            type: 'number',
            precision: 0,
            minRows: 1,
            controls: false,
            rules: [
              {
                required: true,
                message: '请输入返厂数量',
                trigger: 'blur'
              }
            ]
          },
          {
            label: '不良现象',
            prop: 'ngPhenomenon',
            width: 300,
            cell: true,
            type: 'select',
            dicData: [],
            multiple: true,
            filterable: true
          },
          {
            label: '故障说明',
            prop: 'faultDescription',
            cell: true,
            width: 300
          }
        ]
      },
      selectionDetailList: [],
      logisticsInfoOption: {
        submitBtn: false,
        emptyBtn: false,
        labelWidth: 150,
        column: [
          {
            label: '联系人',
            prop: 'client',
            span: 8,
            disabled: true,
            placeholder: '联系人'
          },
          {
            label: '联系方式',
            prop: 'clientMobile',
            span: 8,
            disabled: true,
            placeholder: '联系方式'
          },
          {
            label: '客户地址',
            prop: 'clientAddress',
            span: 8,
            disabled: true,
            placeholder: '客户地址'
          },
          {
            label: '提货地址',
            prop: 'pickupAddress',
            span: 8,
            type: 'search',
            disabled: true,
            placeholder: '请选择 提货地址',
            appendClick: () => {
              this.openLocationCommonModal();
            }
          },
          {
            label: '运费类型',
            prop: 'freightType',
            span: 8,
            type: 'select',
            dicData: [
              { label: '到付', value: '到付' },
              { label: '运费险', value: '运费险' }
            ],
            control: (val, form) => {
              if (val === '运费险') {
                return {
                  freightAmt: { display: true }
                };
              } else {
                return {
                  freightAmt: { display: false }
                };
              }
            }
          },
          {
            label: '运费',
            prop: 'freightAmt',
            span: 8,
            type: 'number',
            precision: 2,
            rules: [
              {
                required: false,
                trigger: 'blur',
                validator: (rule, value, callback) => {
                  if (value) {
                    if (value < 0) {
                      callback(new Error('运费不能小于0'));
                    } else {
                      callback();
                    }
                  } else if (value == 0) {
                    callback();
                  }
                }
              }
            ]
          },
          {
            label: '备注',
            prop: 'remark',
            type: 'textarea',
            span: 24,
            maxRows: 3,
            minRows: 3
          }
        ]
      }
    };
  },
  computed: {
    ...mapGetters(['userInfo', 'permission']),
    ids() {
      let ids = [];
      this.selectionList.forEach((ele) => {
        ids.push(ele.id);
      });
      return ids.join(',');
    }
  },
  watch: {
    'form.isCompensation'() {
      if (!this.form.isCompensation) {
        this.form.compensationAmt = undefined;
      }
    },
    'form.freightType'() {
      if (this.form.freightType === '到付') {
        this.form.freightAmt = undefined;
      }
    }
  },
  mounted() {
    this.$nextTick(() => {
      this.$structuralSplit();
    });
  },
  methods: {
    handleDelivery() {
      if (this.selectionList.length !== 1) {
        this.$message.warning('请选择一条数据！');
        return;
      }
      this.$refs.rmaDeliveryRef.showDialog(this.selectionList[0]);
    },
    close() {
      this.rmaDeliveryConfig.visible = false;
    },
    deliverySubmit() {
      this.onLoad(this.page);
    },
    getFailureList() {
      const ngPhenomenon = this.findObject(this.productInfoOption.column, 'ngPhenomenon');
      getFailure({ dictType: 'FAILURE' }).then(
        (res) => {
          ngPhenomenon.dicData = this._map(this._get(res, 'data.data', []), (item) => {
            return {
              label: item.name,
              value: JSON.stringify({ ngPhenomenonId: item.id, ngPhenomenonCode: item.code, ngPhenomenonName: item.name })
            };
          });
        },
        (error) => {
          ngPhenomenon.dicData = [];
        }
      );
    },
    handleAdd() {
      this.getFailureList();
      this.showDialog = true;
      this.dialogTitle = '新增';
      this.form.isCompensation = false;
      this.$nextTick(() => {
        this.$refs.form.allDisabled = false;
        this.$refs.logisticsInfoForm.allDisabled = false;
      });
    },
    rmaRepairIn() {
      let ids = [];
      this._forEach(this.selectionList, (item) => {
        ids.push(item.id);
      });
      repairIn(ids).then((res) => {
        this.$message.success(res.data.msg);
        this.onLoad(this.page);
      });
    },
    closeDialog() {
      this.$refs.form.resetFields();
      this.$refs.logisticsInfoForm.resetFields();
      this.form = {};
      this.productInfoData = [];
    },
    openDeliveryOrderCommonModal() {
      this.modalName = 'deliveryOrderModal';
      this.$refs.commonModalTemplate.showModal();
      this.tableOption = {
        modalTitle: '选择销售出库单（双击进行选择）',
        url: '/api/mes-warehouse/sheetheader/page?sheetTypeStrList=DO',
        isPage: true,
        rowSelectionType: 'single',
        columnDefs: [
          {
            label: '销售出库单号',
            prop: 'sheetNo'
          },
          {
            label: '客户名称',
            prop: 'partnerName',
            search: true
          },
          {
            label: '联系人',
            prop: 'customerPrincipal'
          },
          {
            label: '联系方式',
            prop: 'customerContacts'
          },
          {
            label: '客户地址',
            prop: 'customerAddress'
          }
        ]
      };
    },
    /**
     * 打开地址选择模态框
     */
    openLocationCommonModal() {
      this.modalName = 'locationModal';
      this.$refs.commonModalTemplate.showModal();
      this.tableOption = {
        modalTitle: '选择提货地址（双击进行选择）',
        url: '/api/mes-admin/location/page?status=0',
        isPage: true,
        rowSelectionType: 'single',
        columnDefs: [
          {
            label: '地址名称',
            prop: 'name'
          },
          {
            label: '国家',
            prop: 'country'
          },
          {
            label: '省份',
            prop: 'province'
          },
          {
            label: '城市',
            prop: 'city'
          },
          {
            label: '详细地址1',
            prop: 'location1'
          },
          {
            label: '详细地址2',
            prop: 'location2'
          },
          {
            label: '详细地址3',
            prop: 'location3'
          },
          {
            label: '详细地址4',
            prop: 'location4'
          }
        ]
      };
    },
    /**
     * 选择模态框行数据
     */
    getSelectedRows(rowData) {
      switch (this.modalName) {
        case 'deliveryOrderModal':
          this.form.sheetId = rowData.id;
          this.form.deliveryOrderNo = rowData.sheetNo;
          this.form.partnerName = rowData.partnerName;
          this.form.partnerNo = rowData.partnerCode;
          // let date = new Date() - new Date(rowData.createTime);
          // this.form.isUnderWarranty =
          this.form.client = rowData.customerPrincipal;
          this.form.clientMobile = rowData.customerContacts;
          this.form.clientAddress = rowData.province + rowData.city + rowData.detailedAddress;
          this.form.createTime = rowData.createTime;
          let newDate = this.$moment(new Date());
          let createTime = this.$moment(this.form.createTime);
          let duration = newDate.diff(createTime, 'months');
          let guaranteePeriod = Number(rowData.guaranteePeriod) * 12;
          if (Number(duration) - Number(guaranteePeriod) <= 0) {
            this.form.isUnderWarranty = true;
          } else {
            this.form.isUnderWarranty = false;
          }
          break;
        case 'productModal':
          let data = this._map(rowData, (item) => {
            return {
              deliveryOrderNo: item.sheetNo,
              partNo: item.partNo,
              partName: item.partMasterName,
              partModel: item.partMasterModel,
              orderQuantity: item.quantity
            };
          });
          let nowData = [];
          if (this.productInfoData.length === 0) {
            nowData = data;
          } else {
            for (let i = 0; i < this.productInfoData.length; i++) {
              for (let j = 0; j < data.length; j++) {
                if (this.productInfoData[i].partNo != data[j].partNo) {
                  nowData.push(data[j]);
                }
              }
            }
          }
          this.productInfoData = [...this.productInfoData, ...nowData];
          this._forEach(this.productInfoData, (item) => {
            item.$cellEdit = true;
          });
          break;
        case 'locationModal':
          this.form.pickupAddress = rowData.name;
          this.form.pickupAddressId = rowData.id;
          break;
        default:
          break;
      }
    },
    submit() {
      this.$refs.form.validate((valid, done) => {
        if (valid) {
          if (this.productInfoData.length === 0) {
            this.$message.error('请添加产品！');
            done();
            return;
          }
          if (this.form.freightAmt < 0) {
            done();
            return;
          }
          for (let i = 0; i < this.productInfoData.length; i++) {
            if (!this.productInfoData[i].rmaQuantity) {
              this.$message.error(`产品编码${this.productInfoData[i].partNo}的返厂数量不能为空！`);
              done();
              return;
            }
            if (Number(this.productInfoData[i].rmaQuantity) > Number(this.productInfoData[i].orderQuantity)) {
              this.$message.error(`产品编码${this.productInfoData[i].partNo}的返厂数量不能大于订单数量！`);
              done();
              return;
            }
            let rmaProductHandlingList = [];
            if (this.productInfoData[i].ngPhenomenon) {
              for (let j = 0; j < this.productInfoData[i].ngPhenomenon.length; j++) {
                let failure = JSON.parse(this.productInfoData[i].ngPhenomenon[j]);
                failure['faultDescription'] = this.productInfoData[i].faultDescription;
                rmaProductHandlingList.push(failure);
              }
            }
            this.productInfoData[i]['rmaProductHandlingList'] = rmaProductHandlingList;
            delete this.productInfoData[i].ngPhenomenon;
          }
          this.form['rmaProductVoList'] = this.productInfoData;
          console.log(this.form);
          addOrUpdate(this.form).then(
            (res) => {
              // 获取新增数据的相关字段
              // const data = res.data.data;
              // row.id = data.id;
              this.showDialog = false;
              this.$message({
                type: 'success',
                message: '操作成功!'
              });
              this.onLoad(this.page);
              this.$refs.crud.refreshTable();
              done();
            },
            (error) => {
              done();
            }
          );
        }
      });
    },
    rowDel(row, index, done) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(row.id);
        })
        .then(() => {
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          // 数据回调进行刷新
          done(row);
        });
    },
    handleDelete() {
      if (this.selectionList.length === 0) {
        this.$message.warning('请选择至少一条数据');
        return;
      }
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(this.ids);
        })
        .then(() => {
          // 刷新表格数据并重载
          this.data = [];
          this.$refs.crud.refreshTable();
          this.$refs.crud.toggleSelection();
          // 表格数据重载
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
        });
    },
    searchReset() {
      this.query = {};
      this.onLoad(this.page);
    },
    searchChange(params, done) {
      this.query = params;
      this.page.currentPage = 1;
      this.onLoad(this.page, params);
      done();
    },
    selectionChange(list) {
      this.selectionList = list;
    },
    selectionClear() {
      this.selectionList = [];
      this.$refs.crud.toggleSelection();
    },
    currentChange(currentPage) {
      this.page.currentPage = currentPage;
    },
    sizeChange(pageSize) {
      this.page.pageSize = pageSize;
    },
    refreshChange() {
      this.onLoad(this.page, this.query);
    },
    onLoad(page, params = {}) {
      this.loading = true;
      getList(page.currentPage, page.pageSize, Object.assign(params, this.query)).then((res) => {
        const data = res.data.data;
        this.page.total = data.total;
        this.data = data.records.map((item) => {
          return {
            ...item,
            hasChildren: item.hasChild
          };
        });
        this.loading = false;
        this.selectionClear();
      });
    },
    /**
     * 重新加载公用表格弹窗组件
     */
    newKey() {
      this.timer = new Date().getTime();
    },
    /**
     * 打开编辑模态框
     */
    opendetailRow(row, type) {
      this.getFailureList();
      this.showDialog = true;
      this.dialogTitle = type === 'edit' ? '编辑' : '查看';
      this.$nextTick(() => {
        this.$refs.form.allDisabled = type === 'edit' ? false : true;
        this.$refs.logisticsInfoForm.allDisabled = type === 'edit' ? false : true;
      });
      getDetail(row.id).then((res) => {
        this.form = this._get(res, 'data.data', {});
        this.form.compensationAmt = this.form.compensationAmt === null ? undefined : this.form.compensationAmt;
        this.form.freightAmt = this.form.freightAmt === null ? undefined : this.form.freightAmt;
        this.productInfoData = this.form.rmaProductVoList;
        this._forEach(this.productInfoData, (item) => {
          item.$cellEdit = type === 'edit' ? true : false;
          item['ngPhenomenon'] = [];
          this._forEach(item.rmaProductHandlingList, (failure) => {
            item['faultDescription'] = failure.faultDescription;
            delete failure.faultDescription;
            let failureItem = {
              ngPhenomenonId: failure.ngPhenomenonId,
              ngPhenomenonCode: failure.ngPhenomenonCode,
              ngPhenomenonName: failure.ngPhenomenonName
            };
            item['ngPhenomenon'].push(JSON.stringify(failureItem));
          });
          delete item.rmaProductHandlingList;
        });
      });
    },
    detailRowDel(row, index, done) {
      this.$confirm('确定将选择数据删除?', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          return remove(row.id);
        })
        .then((res) => {
          this.$refs.crud.refreshTable();
          this.onLoad(this.page);
          this.$message({
            type: 'success',
            message: '操作成功!'
          });
          done();
        });
    },
    /**
     * 新增产品
     */
    handleAddProduct() {
      if (!this.form.deliveryOrderNo) {
        this.$message.warning('请先选择销售出库单号！');
        return;
      }
      this.modalName = 'productModal';
      this.$refs.commonModalTemplate.showModal();
      this.tableOption = {
        modalTitle: '选择产品',
        url: `/api/mes-warehouse/sheetheader/sheet-detail/list-with-part-master?sheetHeaderId=${this.form.sheetId}`,
        isPage: true,
        rowSelectionType: 'multiple',
        columnDefs: [
          {
            label: '销售出库单号',
            prop: 'sheetNo',
            search: true,
            searchLabelWidth: 100
          },
          {
            label: '产品编码',
            prop: 'partNo'
          },
          {
            label: '产品名称',
            prop: 'partMasterName'
          },
          {
            label: '规格型号',
            prop: 'partMasterModel'
          },
          {
            label: '订单数量',
            prop: 'quantity'
          }
        ]
      };
    },
    selectionProductChange(list) {
      this.selectionDetailList = list;
    },
    handleDeleteProduct() {
      if (this.selectionDetailList.length === 0) {
        this.$message.warning('请选择数据！');
        return;
      }
      this._forEach(this.selectionDetailList, (item) => {
        let index = this._findIndex(this.productInfoData, item);
        this.productInfoData.splice(index, 1);
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.showDialog {
  ::v-deep .el-dialog__body {
    padding: 0px 20px;
  }
}
.titleIcon {
  display: flex;
  align-items: center;
}
</style>
